<template>
  <div>
   <header><span @click="blank">返回</span><section class="title">
      <slot></slot>
     </section></header>
  </div>
</template>
<script>
export default {
  name: 'headerCom',
  props:{ // 父传子，记得要指定类型
    // title: String,
    // title: [String,Number], 指定多类型使用数组
    // 使用默认值得情况
    title:{
      type: String,
      default: '商品详情'
    }
  },
  methods: {
     blank(){
      this.$router.go(-1);
    }
  },
}
</script>
<style lang="scss" scoped>
  header{
    height: 50px;
    display: flex;
    width: 100%;
    align-items: center;
    background: skyblue;
    span{
      width: 80px;
      text-align: center;
    }
  }
  .title{
    background: steelblue;
    flex: 1;
    text-align: center;
    line-height: 50px;
  }
</style>

